<template>
    <div style="position: relative;">
        <div class="wallet-bg">
            <div class="wallet-money">1000</div>
            <div class="wallet-v">可提现金额</div>
        </div>

        <div style="position: relative;margin: 20px;top: -40px;">
            <div class="wallet-border">
                <div style="float: left;width: 50%;" @click="recommend">
                    <img src="../assets/recomm.png"
                         style="width: 36px;height: 36px;float: left;padding-top: 20px;padding-left: 30px;">
                    <span style="float: left;padding-left: 10px;">推广明细</span>
                </div>
                <div style="float: left;width: 50%;" @click="withdraw">
                    <span style="float: right;padding-right: 30px;">提现</span>
                    <img src="../assets/get.png"
                         style="width: 36px;height: 36px;float: right;padding-top: 20px;padding-right: 10px;">
                </div>
                <div style="clear: both;"></div>
            </div>
        </div>

        <!--todo-->
        <mt-button style="color: #fff;border-radius: 30px;background-color: #FA74AE;display: block;margin: 0 auto;padding: 0 80px;">
            去推广
        </mt-button>

        <div style="padding: 40px 20px 0 20px;position: relative;">
            <div style="border-top: 1px solid #eee;"></div>
            <div style="ext-align: center;top: -22px;background-color: #fff;width: 64px;margin: 0 auto; margin-top: -10px;text-align: center;font-size: 12px;">
                分成规则
            </div>
        </div>
        <div style="padding:0 20px;font-size: 12px;color: #888888;margin-top: 14px;height: 20px;line-height: 20px;">
            <div>1.只有认证大v才能提现；</div>
            <div>2.提现需绑定手机号和支付宝；</div>
            <div>3.可提现余额每满100元即可提现；</div>
            <div>4.如从事违反国家法律的行为，将冻结账户，v聊将保留提交公安机关的权利。</div>
        </div>
    </div>

</template>

<script>
    export default {
        name: "profit-plan",
        methods: {
            //推荐
            recommend() {
                this.$router.push('spreadDetail')
            },
            //提现
            withdraw() {
                this.$router.push('withdraw')
            }
        }
    }
</script>

<style scoped>
    .wallet-bg {
        width: 100%;
        height: 160px;
        background: linear-gradient(#FA74AE, #FAA0DC);
    }

    .wallet-money {
        text-align: center;
        font-size: 30px;
        color: #fff;
        padding-top: 40px;
    }

    .wallet-v {
        text-align: center;
        color: #fff;
        font-size: 13px;
    }

    .wallet-border {
        border: 1px solid #eee;
        height: 80px;
        line-height: 80px;
        border-radius: 5px;
        background-color: #fff;
    }

</style>